<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /* 
        1. Object.defineProperty(哪一个对象,哪一个属性名字,{配置项});
        // 以原始数据作为基础  对数据进行一份拷贝 (把原始数据劫持出来 )
        // 复制出来的数据 不允许被修改 ,值是从原始数据中获得的 
        // 修改的话也是修改原始数据  

        // 配置项
        1. value 属性对应的值 
        2. writeable 该属性的值是否可以被写 默认 false
        3. emunerable 该属性的值是否可以被枚举(遍历取到) 默认 false  
        4. get : 函数 getter获取器 可以决定 获取属性的值 
            返回值  就是 这个属性对应的值 
            注意: 不能 跟value 和 writeable 一起用  如果一起用报错 
            

            如果用户想获取属性对应的值 get函数就被自动调用
            在函数内可以做一些事情  
        5. set: 函数 setter 设置器 当你需要修改属性的值的时候 这个函数自动被调用





        
        
        
        */

       // 1-1 
    // const obj = {};
    // obj.name = '张三' 
    
    // 上面直接就赋值了 捕获不到行为 

    // 想办法捕获行为  
    // const obj = {};
    // Object.defineProperty(obj,'name',{
    //     // value:'kangbazi',
    //     // writable:true,
    //     enumerable:true,
    //     get(){
    //         console.log('你小子想获取数据');
    //         return '凤姐'
    //     },
    //     set(val){
    //         console.log('你想修改,凤姐是你得不到的传说');
    //         console.log(`你想把值改成${val}`);
    //         // obj.name = val; 直接这么写 运行一段时间会报错 
    //         // 超出递归次数限制
    //     }
    // });

    // console.log(obj); //{name: 'kangbazi'}
    // obj.name = 'TFBOYS'; // 因为 writeable 默认是false name属性的值不允许修改
    // console.log(obj); // {name: 'kangbazi'}


    // console.log(obj); //{name: 'kangbazi'}
    // obj.name = 'TFBOYS';// 因为 writeable true name属性的值允许修改
    // console.log(obj); // {name: 'TFBOYS'}

    // emunerable默认false  

    // for(var v in obj){
    //     console.log(v); //什么也拿不到 
    // }

    // // emunerable 为 true  

    // for(var v in obj){
    //     console.log(v,obj[v]); //name kangbazi 
    // }


    // 获取对象的属性的值  
    // console.log(obj.name);
    // obj.name = '芙蓉姐姐';
    // console.log(obj);





    const obj = {name:'张三',age:18}
    const result  = {}; // obj是原始数据 result obj数据劫持后拷贝到result 身上
    // result 不允许被修改 改的话是原始数据  
    Object.defineProperty(result,'name',{
        get(){
            console.log('你正在获取name属性的值');
            return obj.name+'6666';
        },
        set(val){
            console.log('你正在修改name属性的值');
            obj.name = val;
        }
    })


    // console.log(obj.name); // 这种写法 直接从对象获取属性 没有走Object.defineProperty
    // 压根捕获不到获取的行为 

    // console.log(result.name);

    // obj.name = '思聪'; // // 这种写法 直接修改对象属性 没有走Object.defineProperty
    // // 压根捕获不到修改的行为 
    // console.log(obj);

    // result.name = '思聪';
    // // 这种写法 走了Object.defineProperty 能捕获到行为  
    // console.log(obj);// 这是改后的结果  obj发生变化

    </script>
</body>
</html>